import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import {RouterModule, Routes} from '@angular/router';
import {FrontComponent} from './front.component';
import {StyleComponent} from './style/style.component';
// import {CssComponent} from './style/css/css.component';
// import {LessComponent} from './style/less/less.component';
// import {SassComponent} from './style/sass/sass.component';
import {ScriptComponent} from './script/script.component';
import {TypescriptComponent} from './script/typescript/typescript.component';
import {JavascriptComponent} from './script/javascript/javascript.component';
import {StructComponent} from './struct/struct.component';



const  frontRoute: Routes = [
  {path: '', component: FrontComponent, children: [
      {path: '', redirectTo: '/front/struct', pathMatch: 'full'},
      {path: 'struct', component: StructComponent},
      {path: 'style', component: StyleComponent, children: [
        // {path: 'css', component: CssComponent},
        // {path: 'sass', component: SassComponent},
        // {path: 'less', component: LessComponent}
        ]},
      {path: 'script', component: ScriptComponent, children: [
          {path: '', redirectTo: '/front/script/javascript', pathMatch: 'full'},
          {path: 'javascript', component: JavascriptComponent},
          {path: 'typescript', component: TypescriptComponent},
          {path: 'compare', component: JavascriptComponent, outlet: 'js'},
          {path: 'compare', component: TypescriptComponent, outlet: 'ts'}
        ]}
    ]}
];
@NgModule({
  imports: [
    CommonModule,
    RouterModule.forChild(frontRoute)
  ],
  declarations: [
    FrontComponent,
    // CssComponent,
    // LessComponent,
    // SassComponent,
    TypescriptComponent,
    JavascriptComponent,
    StructComponent,
    StyleComponent,
    ScriptComponent
  ]
})
export class FrontModule { }
